// 资源
// import logo from "./logo.svg";
// 组件css
import "./App.css";
// 路由占位符
import RounterIndex from "./router/"; //路由
// 引入的资源
// import Button from "@material-ui/core/Button";

//路由
import { BrowserRouter, Link } from "react-router-dom";

// redux 的数据
import { Provider } from "react-redux"; // 数据传递
import store from "./redux/store"; // store 数据管理

import Load from "./views/redux/loading/loading";

// 函数时组件
function App() {
  console.log(store.getState(), "===store");
  let loading = store.getState().loading.loading;
  console.log(loading,'===loading')
  return (
    <div className="App">
      {/* 路由内部监听 */}
      <BrowserRouter>
        {/* 调转 并刷新  */}
        <a href="/home">a标签跳转&emsp;&emsp;</a>
        {/* 组件跳转 */}
        <Link to={{ pathname: "/home" }}>组件跳转home(router)&emsp;&emsp;</Link>
        <Link to={{ pathname: "/me" }}>组件跳转me&emsp;&emsp;</Link>
        <Link to={{ pathname: "/ajax" }}>ajax&emsp;&emsp;</Link>
        <Link to={{ pathname: "/redux" }}>redux&emsp;&emsp;</Link>
        <Link to={{ pathname: "/event" }}>event&emsp;&emsp;</Link>
        <Link to={{ pathname: "/base" }}>base&emsp;&emsp;</Link>
        <Link to={{ pathname: "/component" }}>component&emsp;&emsp;</Link>
        <Link to={{ pathname: "/fun" }}>fun&emsp;&emsp;</Link>
        <Provider store={store}>
          <RounterIndex />
          {/* 在 Provider 包裹store 可以全局使用 */}
          <Load></Load>
        </Provider>
      </BrowserRouter>
      
    </div>
  );

  //HTML方式：
// var data = {id:3};
// var path = {
//   pathname:'/role',
//   state:data,
// }
// <NavLink  to={path} >日志</NavLink>
// //JS方式：
// this.props.history.push({ pathname: '/three' , state: { id: '6666' }})
}

export default App;
